<%--
  Created by IntelliJ IDEA.
  User: 86178
  Date: 2021/5/25
  Time: 9:38
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <link href="${pageContext.request.contextPath}/css/bootstrap.min.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/css/bootstrap-theme.min.css" rel="stylesheet">
    <script src="${pageContext.request.contextPath}/js/jquery-3.4.1.min.js"></script>
    <script src="${pageContext.request.contextPath}/js/bootstrap.min.js"></script>
    <title>上传视频</title>
    <style>
        body{
            margin: 100px 100px;
        }
    </style>
</head>
<body class="container">
    <form role="form" class="form-inline" enctype="multipart/form-data"
          action="${pageContext.request.contextPath}/upload" method="post">
        <label>上传文件</label>
        <div class="form-inline">
            <input class="form-group" type="file" name="file">
            <button type="button" class="form-group btn-warning"
                    onclick="removeThis(this)">删除</button>
        </div>
        <br>
        <button type="button" class="btn btn-success" onclick="more(this)">more...</button>
        <button type="submit" class="btn btn-primary">提交</button>
    </form>
</body>
<script type="text/javascript">

    function removeThis(my) {
        var pe = my.parentElement;
        pe.remove();
        console.log(my.parentElement)
    }

    function more(my) {
        var pe = my.parentElement;
        var myDiv = document.createElement("div");
        myDiv.setAttribute("class", "form-inline");
        var myInput = document.createElement("input");
        //  class="form-group" type="file" name="file"
        myInput.setAttribute("class", "form-group");
        myInput.setAttribute("type", "file");
        myInput.setAttribute("name", "file");
        myDiv.appendChild(myInput);
        var myButton = document.createElement("button");
        //   type="button" class="form-group btn-warning" onclick="removeThis(this)"
        myButton.setAttribute("type", "button");
        myButton.setAttribute("class", "form-group btn-warning");
        myButton.setAttribute("onclick", "removeThis(this)");
        myButton.innerHTML = "删除";
        myDiv.appendChild(myButton);
        pe.insertBefore(myDiv, my);
        var myBr = document.createElement("br");
        pe.insertBefore(myBr, my);
        console.log(myButton);
    }
</script>
</html>
